<template>
  <div class="page has-navbar has-tabbar" v-tabbar-menu-index="2">
    <von-header theme="light">
        <span slot="title">工作台</span>
    </von-header>
    <div class="page-content padding-top">
    	<div class="wrap" v-for="listItem in workArr">
    		<div class="title">{{listItem.resourceName}}<div class="hairline-bottom"></div></div>
    		<div class="box clearfix">
		        <div class="center-btn" v-for="workItem in listItem.resourceList" @click="turnToPage(workItem.resourceUrl)">
		        	
		            <i><img class="" :src="'static/icon/'+workItem.resourceIcon+'.svg'"><span v-if="workItem.nums>0" class="center-btn-posi">{{workItem.nums}}</span></i>
		            <p>{{workItem.resourceName}}</p>
                <p><small v-if="workItem.numsto > 0">{{workItem.numsto}} 辆</small></p>
		        </div>
        </div>
    	</div>
    </div>
  </div>
</template>
<script>
  export default {
    data(){
      return {
      	workArr:[]
      }
    },
    created(){
      var resourceJson = sess.get('userSession').resourceList;
      for (var i = 0; i < resourceJson.length; i++) {
        if(resourceJson[i].resourceId == "43785"){
           this.workArr = resourceJson[i].resourceList;
        }
      }
      if(sess.get('userSession').shopId){
        axios.get(baseUrl+'/crm-web/controller/resForApp/bashboard',{params:{
        	followerId:sess.get('userSession').userId,
        	shopId:sess.get('userSession').shopId
        }}).then(res=>{
        	this.workArr.map(item=>{
        		if(item.resourceId == "62039"){
        			item.resourceList.map(itemto=>{   
        				switch(itemto.resourceId){
        					case "21758":
        						this.$set(itemto,'nums',res.data.result.xkhdfp)
        					  break
        					case "88572":
        						this.$set(itemto,'nums',res.data.result.ygwcl)
        						break
        					case "88736":
        					  this.$set(itemto,'nums',res.data.result.xfpdcl)
        					  break
        					case "84754":
        					  this.$set(itemto,'nums',res.data.result.jrwcl)
        					  break
        					case "16990":
        						this.$set(itemto,'nums',res.data.result.gqwcl)
        					  break
        					default:
        						break
        				}
        			})
        		}      		
        	})
        })
      }

      if(sess.get('userSession').marketId){
        window.axios.get(baseUrl + '/controller/car/getCarNumInfo', {params: {
          marketId: sess.get('userSession').marketId,
          shopId: sess.get('userSession').shopId || ''
        }}).then(res => {
          console.log(this.workArr)
          this.workArr.map(item=>{
        		if(item.resourceId == "73819"){
              item.resourceList.map(itemto=>{   
        				switch(itemto.resourceIcon){
        					case "ic_car_fail_in_garage":
        						this.$set(itemto,'numsto',res.data.result.initialNum)
        					  break
        					case "ic_car_in_warehouse":
        						this.$set(itemto,'numsto',res.data.result.toStorageApplyNum)
        						break
        					case "ic_car_in_storage":
        					  this.$set(itemto,'numsto',res.data.result.storageNum)
        					  break
        					case "ic_car_already":
        					  this.$set(itemto,'numsto',res.data.result.carOrderNum)
        					  break
        					case "ic_car_out_storage":
        						this.$set(itemto,'numsto',res.data.result.outStorageNum)
        					  break
        					default:
        						break
        				}
        			})
            }
          })
        })
      }

    },
    methods: {
      turnToPage(path){
        if (path == '') {
          $toast.show('此功能正在研发中...',2000);
          return false
        }
        if (path.indexOf('http') >=0) {
          window.location.href = path;
        }else{
          $router.forward(path)
        }
      }
    }
  }
</script>
<style scoped>
.center-btn-posi{ position: absolute; right:0; top: 0; border-radius: 50%; background: #FF0000; color: #fff; text-align: center; height: 16px; width: 16px; line-height: 16px; font-size: 12px;}
.wrap{
	padding: 0 10px;
	background-color: #fff;
}
.title{
	height: 40px;
    line-height: 40px;
    padding-left: 10px;
    background-color: #fff;
    /*border-bottom: 1px solid #d9d9d9;*/
    position: relative;
    top: 5px;
}
.title:after{
	    width: 88px;
    height: 2px;
    background: #fd6b2c;
    content: " ";
    position: absolute;
    bottom: 0px;
    left: 0;
}
.box{
	padding: 10px 0
}

  .center-btn{
  	
    text-align: center;
    width: 25%;
    padding: 10px 0;
    float: left;
  }
  .center-btn i{
  	position: relative;
    width: 50px;
    height: 50px;
    display: inline-block;
  }
  .center-btn i img{
    width: 100%;
  }
  .center-btn-box{
    padding: 10px 20px;
    background-color: #fff;
  }
  .center-btn p{
    height: 20px;
    line-height: 20px;
    font-size: 12px;
    color: #666;
    margin-bottom: 0;
  }
  
</style>

